<template>
  <div>
    {{ msg }}
    <FTinymce v-model="msg"
                    :disabled="disabled"
                    @onClick="onClick"
                    ref="editor"></FTinymce>
    <button @click="clear">清空内容</button>
    <button @click="disabled = true">禁用</button>
    <button @click="disabled = false">启动</button>
  </div>
</template>

<script>
  import FTinymce from '@/components/f-tinymce/f-tinymce'
  export default {
    components: {
      FTinymce
    },
    data () {
      return {
        msg: 'Welcome to Use Tinymce Editor',
        disabled: false
      }
    },
    methods: {
      // 鼠标单击的事件
      onClick (e, editor) {
        console.log('Element clicked')
        console.log(e)
        console.log(editor)
      },
      // 清空内容
      clear () {
        this.$refs.editor.clear()
      }
    }
  }
</script>

<style scoped>
</style>
